<template>
    <div>
        <div class="return-bar">
            <i class="iconfont" @click="back()">&#xe668</i>
            电子签章及授权
        </div>

        <div class="top">
            <group>
                <switch title="电子签章"
                :disabled.sync="sign.disabled"
                :value.sync="sign.checked"
                @click=" setSign "
                 ></switch>
            </group>

            <group>
                <switch title="签章授权"
                :disabled.sync="permit.disabled"
                :value.sync="permit.checked"
                @click=" setPermit "
                ></switch>
            </group>


        </div>

        <div class="fb_box1">

            <div class="ux_row">
                <div class="ux_flex">
                    <button class="gr_btn"  @click="back()">返回</button>
                </div>
            </div>
        </div>


        <contract
        :show_loading.sync="show_loading"
        ></contract>

        <com-alert
        :show.sync="alertData.show"
        :title.sync="alertData.title"
        :buttontxt.sync="alertData.buttontxt"
        :content.sync="alertData.content"
        ></com-alert>
    </div>
</template>

<script>
var vm = this;
import {Group, Switch } from 'vux'
import api from '../../../data/api'
import ComAlert from '../../../components/common/alert'
import Contract from '../../../components/common/contract'
import { mapGetters } from 'vuex'
export default {
    name:'sign_contract',

    data(){
        return {
            from:'',

            alertData:{
                show:false,
                title:'标题',
                buttontxt:'确定',
                content:'sign'
            },

            sign: {
                disabled:false,
                checked:false
            },
            permit:{
                disabled:false,
                checked:false
            }
        }
    },

    computed: {
		...mapGetters([
            'contractStatus','contractPermit', 'contractSign'
        ])
    },


    components: {
        ComAlert,
        Contract,
        Group,
        Switch
    },

    /* ready(){
        vm.init();
    }, */

    methods: {
        back(){
            if(vm.from!='')
                this.$route.router.go(vm.from)
            else
                this.$route.router.go('/user')
        },



        async setSign(event){
            if(event.target.checked){

                vm.$store.dispatch('setShowLoading', true);
                await vm.$store.dispatch('setContractSign');
                vm.$store.dispatch('setShowLoading', false);
                vm.alertData = {show:true, title:'信息提示', buttontxt:'确定', content:vm.contractSign.msg};
            }
        },

        async setPermit(event){
            if(event.target.checked){
                vm.$store.dispatch('setShowLoading', true);
                await vm.$store.dispatch('setContractPermit');
                if(vm.contractPermit.status){
                    window.location.href = vm.contractPermit.url;
                }
                vm.$store.dispatch('setShowLoading', false);
            }
        },

        init(){

            vm.sign.checked = !vm.contractStatus.open_status;
            vm.sign.disabled =  vm.sign.checked ? true:false;

            if(!vm.sign.checked) return;  //如果没有签章，直接终止
            vm.permit.checked = !vm.contractStatus.auto_status;
            vm.permit.disabled =  vm.permit.checked ? true:false;
        }
    },

    route: {
        activate ( transition ) {
            vm = this;
            transition.next();
            vm.init();

            vm.from = transition.to.query.from || '';

            console.log(vm.from)
            //vm.getContract();
        }
    }

}
</script>
